<html>
    <wicket:panel xmlns:wicket="http://wicket.apache.org">
        <script type="module" wicket:id="messagerScript"></script>
        <div id="gradeTableWrapper">
            <div wicket:id="gradeTable" id="gradeTable" accesskey="g" wicket:message="aria-label:gradetable.wrapper.tooltip" aria-describedby="gradeTableCaption"></div>
        </div>

        <script id="courseGradeHeaderTemplate" type="text/template">
            <span class="colHeader d-none"></span>
            <div class="relative">
                <a class="gb-title d-block overflow-hidden text-truncate" wicket:message="title:sortbygrade,aria-label:sortbygrade">
                    <wicket:message key="column.header.coursegrade"/>
                </a>
                <div class="gb-title gb-grade-item-flags">
                    {if settings.isCourseGradeReleased}
                    <span class="gb-flag-released" wicket:message="title:label.coursegrade.released">
                        {if settings.isUserAbleToEditAssessments}
                            <span aria-hidden="true" style="display:none;" class="gb-tooltip-extras">
                                <div>
                                    <a href="javascript:void(0);" class="gb-gradebook-settings"><wicket:message key="label.coursegrade.editsettings"/></a>
                                </div>
                            </span>
                        {/if}
                    </span>
                    {else}
                    <span class="gb-flag-not-released" wicket:message="title:label.coursegrade.notreleased">
                        {if settings.isUserAbleToEditAssessments && settings.isShowDisplayCourseGradeToStudentEnabled}
                            <span aria-hidden="true" style="display:none;" class="gb-tooltip-extras">
                                <div>
                                    <a href="javascript:void(0);" class="gb-gradebook-settings"><wicket:message key="label.coursegrade.editsettings"/></a>
                                </div>
                            </span>
                        {/if}
                    </span>
                    {/if}
                </div>
                {if settings.isUserAbleToEditAssessments}
                    <div class="dropdown dropend position-absolute top-0 end-0">
                        <button type="button"
                            class="btn btn-sm btn-default bi bi-gear-fill dropdown-toggle"
                            data-bs-toggle="dropdown"
                            data-bs-popper-config='{"strategy": "fixed"}'
                            aria-haspopup="true"
                            aria-expanded="false"
                            wicket:message="title:coursegrade.header.menulabel"
                            tabindex="-1">
                        </button>
                        <ul class="dropdown-menu">
                            {if settings.isSetUngradedToZeroEnabled}
                                <li><a href="javascript:void(0);" class="gb-set-zero-score dropdown-item"><wicket:message key="coursegrade.option.setungraded" /></a></li>
                            {/if}
                            {if !settings.isCategoryTypeWeighted}
                                <li>
                                    <a href="javascript:void(0);" class="gb-toggle-points dropdown-item">
                                    {if settings.showPoints}
                                        <wicket:message key="coursegrade.option.hidepoints" />
                                    {else}
                                        <wicket:message key="coursegrade.option.showpoints" />
                                    {/if}
                                    </a>
                                </li>
                            {/if}
                                <li><a href="javascript:void(0);" class="gb-view-course-grade-statistics dropdown-item"><wicket:message key="coursegrade.option.viewcoursegradestatistics" /></a></li>
                                <li><a href="javascript:void(0);" class="gb-course-grade-breakdown dropdown-item" ><wicket:message key="coursegrade.option.coursegradebreakdown" /></a></li>
                        </ul>
                    </div>
                {/if}
            </div>
        </script>
        <script id="assignmentHeaderTemplate" type="text/template">
            <span class="colHeader d-none"></span>
            <div class="relative">
                {if extraCredit}
                    <span class="gb-flag-extra-credit" wicket:message="title:label.gradeitem.extracredit"></span>
                {/if}
                {if externallyMaintained}
                    <span class="gb-external-app ${externalAppIconCSS}"
                          wicket:message="title:label.gradeitem.externalapplabel">
                    </span>
                {/if}
                <div class="{if extraCredit && externallyMaintained} gb-item-title-3 {elseif extraCredit || externallyMaintained} gb-item-title-2 {else} gb-item-title-1 {/if} d-inline-block overflow-hidden text-truncate">
                    <a class="gb-title" title="${tooltip}">
                        ${abbrevTitle}
                    </a>
                    {if hasAssociatedRubric}
                        <span class="si si-sakai-rubrics" wicket:message="title:rubrics.question_use_rubric"></span>
                    {/if}
                </div>
                {if settings.isCategoriesEnabled}
                    {if categoryId}
                        <div class="gb-category overflow-hidden text-truncate">
                            <wicket:message key="label.category"/>
                            {if categoryExtraCredit}
                                <span class="gb-flag-extra-credit" wicket:message="title:label.gradeitem.extracreditcategory"></span>
                            {/if}
                            {if categoryEqualWeight}
                                <span class="gb-flag-equal-weight" wicket:message="title:label.gradeitem.equalweightcategory"></span>
                            {/if}
                            <span title="${categoryName}">${categoryName}</span>
                            {if settings.isCategoryTypeWeighted}
                                <span class="gb-category-weight">[${categoryWeight}]</span>
                            {/if}
                        </div>
                    {else}
                        <div class="gb-uncategorized overflow-hidden text-truncate">
                            <wicket:message key="gradebookpage.uncategorised"/>
                        </div>
                    {/if}
                {/if}
                <div class="gb-grade-section overflow-hidden text-truncate">
                    {if settings.isPercentageGradeEntry}
                        <wicket:message key="label.relativeweight"/>
                    {else}
                        <wicket:message key="label.total"/>
                    {/if}
                    <span class="gb-total-points">
                        ${points}
                    </span>
                </div>
                <div class="gb-due-date overflow-hidden text-truncate">
                    <wicket:message key="label.due"/> 
                    <span>${dueDate}</span>
                </div>
                <div class="gb-title gb-grade-item-flags">
                    {if includedInCourseGrade}
                        <span class="gb-flag-counted" wicket:message="title:label.gradeitem.counted"></span>
                    {else}
                        <span class="gb-flag-not-counted" wicket:message="title:label.gradeitem.notcounted"></span>
                    {/if}
                    {if released}
                        <span class="gb-flag-released" wicket:message="title:label.gradeitem.released"></span>
                    {else}
                        <span class="gb-flag-not-released" wicket:message="title:label.gradeitem.notreleased"></span>
                    {/if}
                </div>
                <div class="dropdown dropend position-absolute top-0 end-0">
                    <button type="button"
                            class="btn btn-sm btn-default bi bi-gear-fill dropdown-toggle"
                            data-bs-toggle="dropdown"
                            data-bs-popper-config='{"strategy": "fixed"}'
                            aria-haspopup="true"
                            aria-expanded="false"
                            tabindex="-1">
                    </button>
                    <ul class="dropdown-menu">
                        {if settings.isUserAbleToEditAssessments}
                            <li><a href="javascript:void(0);" class="edit-assignment-details dropdown-item"><wicket:message key="assignment.option.edit" /></a></li>
                            <li><a href="javascript:void(0);" class="gb-quick-entry dropdown-item"><wicket:message key="link.quickentry" /></a></li>
                        {/if}
                        <li><a href="javascript:void(0);" class="gb-view-statistics dropdown-item"><wicket:message key="assignment.option.viewgradestatistics" /></a></li>
                        {if hasAssociatedRubric && !externallyMaintained}
                        <li><a href="javascript:void(0);" class="b-move-left gb-rubric-export dropdown-item"><wicket:message key="export.zip.template.button" /></a></li>
                        {/if}
                        {if settings.isUserAbleToEditAssessments}
                            <li><a href="javascript:void(0);" class="gb-move-left dropdown-item"><wicket:message key="assignment.option.moveleft" /></a></li>
                            <li><a href="javascript:void(0);" class="gb-move-right dropdown-item"><wicket:message key="assignment.option.moveright" /></a></li>
                        {/if}
                        {if hasAssociatedRubric}
                            <li><a href="javascript:void(0);" class="preview-assignment-rubric dropdown-item"><wicket:message key="assignment.option.preview" /></a></li>
                        {/if}
                        {if !externallyMaintained && settings.isUserAbleToEditAssessments}
                            <li><a href="javascript:void(0);" class="gb-set-ungraded dropdown-item"><wicket:message key="assignment.option.setungraded" /></a></li>
                        {/if}
                        <li><a href="javascript:void(0);" class="gb-hide-column dropdown-item" data-assignmentid="${assignmentId}"><wicket:message key="assignment.option.hide" /></a></li>
                        <li><a href="javascript:void(0);" class="gb-message-students dropdown-item" data-assignment-id="${assignmentId}"><wicket:message key="label.submission-messager.title" /></a></li>
                        {if !externallyMaintained && settings.isUserAbleToEditAssessments}
                            <li><a href="javascript:void(0);" class="gb-delete-item text-danger dropdown-item"><wicket:message key="delete.label" /></a></li>
                        {/if}
                    </ul>
                    <div id="gb-messager-for-${assignmentId}" style="display: none;" wicket:message="title:label.submission-messager.title">
                      <sakai-submission-messager assignment-id="${assignmentId}" gradebook-id="${settings.gUid}" title="${abbrevTitle}"></sakai-submission-messager>
                    </div>
                </div>
            </div>
        </script>
        <script id="categoryScoreHeaderTemplate" type="text/template">
            <span class="colHeader d-none"></span>
            <div class="relative">
                {if getExtraCredit}
                    <span class="gb-flag-extra-credit" wicket:message="title:label.gradeitem.extracreditcategory"></span>
                {/if}
                {if equalWeight}
                    <span class="gb-flag-equal-weight" wicket:message="title:label.gradeitem.equalweightcategory"></span>
                {/if}
                <a class="gb-title {if getExtraCredit && equalWeight} gb-category-title-3 {elseif getExtraCredit || equalWeight} gb-category-title-2 {else} gb-category-title-1 {/if} d-block overflow-hidden text-truncate" title="${tooltip}">
                    <span class="gb-category">
                        <span class="swatch" style="background-color: #${color}"></span>
                        ${categoryName}
                        {if settings.isCategoryTypeWeighted}
                            <div class="gb-category-weight-label overflow-hidden text-truncate">
                                <wicket:message key="label.gradeitem.categoryaveragelabel"/>
                                <span class="gb-category-weight" wicket:message="title:label.gradeitem.categoryweight">
                                    [${weight}]
                                </span>
                            </div>
                        {/if}
                    </span>
                </a>
                <div class="gb-grade-section gb-category-points-section overflow-hidden text-truncate">
                    {if settings.isPercentageGradeEntry}
                        <wicket:message key="label.relativeweight"/>
                    {else}
                        <wicket:message key="label.total"/>
                    {/if}
                    <span class="gb-total-points">
                        ${totalPoints}
                    </span>
                </div>	
                {for info in dropInfo}
                <div class="gb-drop-info overflow-hidden text-truncate">${info}</div>
                {/for}
                <div class="dropdown dropend position-absolute top-0 end-0">
                    <button type="button"
                        class="btn btn-sm btn-default bi bi-gear-fill dropdown-toggle"
                        data-bs-toggle="dropdown"
                        data-bs-popper-config='{"strategy": "fixed"}'
                        aria-expanded="false"
                        aria-haspopup="true"
                        tabindex="-1">
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="gb-hide-column dropdown-item" data-categoryid="${categoryId}"><wicket:message key="assignment.option.hide" /></a></li>
                    </ul>
                </div>
            </div>
        </script>
        <script id="studentHeaderTemplate" type="text/template">
            <div class="relative">
                <div class="colHeader">
                    <a class="gb-title d-block overflow-hidden text-truncate" wicket:message="title:sortbyname,aria-label:sortbyname">
                        <wicket:message key="column.header.students"/>
                    </a>
                    <div class="dropdown dropend position-absolute top-0 end-0">
                        <button type="button"
                            class="btn btn-sm btn-default bi bi-gear-fill dropdown-toggle"
                            data-bs-toggle="dropdown"
                            data-bs-popper="static"
                            aria-haspopup="true"
                            aria-expanded="false"
                            wicket:message="title:students.menulabel"
                            tabindex="-1">
                        </button>
                        <ul class="dropdown-menu" data-bs-popper="static" data-bs-placement="left-start">
                            {if !settings.isStudentOrderedByLastName}
                                <li><a class="gb-student-name-order-toggle dropdown-item" data-order-by="last_name" href="#"><wicket:message key="sortbyname.option.last"/></a></li>
                            {/if}
                            {if !settings.isStudentOrderedByFirstName}
                                <li><a class="gb-student-name-order-toggle dropdown-item" data-order-by="first_name" href="#"><wicket:message key="sortbyname.option.first"/></a></li>
                            {/if}
                        </ul>
                    </div>
                </div>
            </div>
        </script>
        <script id="studentNumberHeaderTemplate" type="text/template">
            <div class="relative">
                <div class="colHeader">
                    <a class="gb-title" wicket:message="title:label.gradeitem.studentnumberheadertooltip,aria-label:label.gradeitem.studentnumberheadertooltip">
                        <wicket:message key="column.header.studentNumber"/>
                    </a>
                </div>
            </div>
        </script>
        <script id="studentNumberCellTemplate" type="text/template">
            <div class="relative gb-student-number-cell">
                <div class="gb-value d-flex mt-3 justify-content-center">
                    <div class="rowHeader">
                        ${studentNumber}
                    </div>
                </div>
            </div>
        </script>
        <script id="sectionsHeaderTemplate" type="text/template">
            <div class="relative">
                <div class="colHeader">
                    <a class="gb-title" wicket:message="title:label.gradeitem.sectionsheadertooltip,aria-label:label.gradeitem.sectionsheadertooltip">
                        <wicket:message key="column.header.sections"/>
                    </a>
                </div>
            </div>
        </script>
        <script id="sectionsCellTemplate" type="text/template">
            <div class="gb-value d-flex mt-3 justify-content-center gb-section-cell">
              {if sections.length > 0}
              <div class="dropdown">
                <button type="button"
                    class="btn btn-secondary gb-section-button dropdown-toggle"
                    title="${sections[0]}"
                    id="dropdownMenuButton"
                    data-bs-toggle="dropdown"
                    data-bs-popper-config='{"strategy": "fixed"}'
                    aria-haspopup="true"
                    aria-expanded="false">
                  ${sections[0]}
                </button>
                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                {for s in sections}
                  <div class="dropdown-item">${s}</div>
                {/for}
                </div>
              </div>
              {else}
                <wicket:message key="sections.label.none"/>
              {/if}
            </div>
        </script>
        <script id="cellTemplate" type="text/template">
            <div class="relative">
                <div class="gb-editable">
                    <span class="gb-value d-flex mt-3 justify-content-center">${value}</span>
                </div>
                <span class="gb-notification"></span>
                <span class="gb-comment-notification bi bi-chat-right-dots position-absolute bottom-0 end-0 mx-2"></span>
                <div class="btn-group dropend position-absolute top-0 end-0">
                    <button type="button"
                        class="btn btn-sm btn-default si si-settings dropdown-toggle"
                        data-bs-toggle="dropdown"
                        data-bs-popper-config='{"strategy": "fixed"}'
                        aria-haspopup="true"
                        aria-expanded="false"
                        tabindex="-1">
                    </button>
                    <ul class="dropdown-menu">
                        <li class="gb-grade-rubric-li"><a class="gb-grade-rubric dropdown-item" href="#"><wicket:message key="rubrics.option.graderubric" /></a></li>
                        <li><a class="gb-view-log dropdown-item" href="#"><wicket:message key="grade.option.viewlog" /></a></li>
                        <li><a class="gb-edit-comments dropdown-item" href="#"><wicket:message key="comment.option.edit" /></a></li>
                        <li><a class="gb-excuse-grade dropdown-item" href="#"><wicket:message id="excuse-message" key="excuse.grade" /></a></li>
                    </ul>
                </div>
            </div>
        </script>
        <script id="courseGradeCellTemplate" type="text/template">
            <div class="relative">
                <span class="gb-value d-flex mt-3 justify-content-center {if isOverridden} gb-overridden {/if}">
                    ${value}
                </span>
                <span class="gb-notification"></span>
                <span class="gb-course-comment-notification bi bi-chat-right-dots position-absolute bottom-0 end-0 mx-2"></span>
                {if GbGradeTable.settings.isUserAbleToEditAssessments}
                    <div class="btn-group dropend position-absolute top-0 end-0">
                        <button type="button"
                            class="btn btn-sm btn-default si si-settings dropdown-toggle"
                            data-bs-toggle="dropdown"
                            data-bs-popper-config='{"strategy": "fixed"}'
                            aria-haspopup="true"
                            aria-expanded="false"
                            wicket:message="title:coursegrade.cell.menulabel"
                            tabindex="-1">
                        </button>
                        <ul class="dropdown-menu">
                            <li><a class="gb-edit-course-grade-comments dropdown-item" href="#" role="menuitem"><wicket:message key="comment.option.edit" /></a></li>
                            <li><a href="javascript:void(0);" class="gb-course-grade-override dropdown-item"><wicket:message key="coursegrade.option.override"/></a></li>
                            <li><a href="javascript:void(0);" class="gb-course-grade-override-log dropdown-item"><wicket:message key="coursegrade.option.overridelog"/></a></li>
                        </ul>
                    </div>
                {/if}
            </div>
        </script>
        <script id="studentCellTemplate" type="text/template">
            {if settings.isStudentOrderedByLastName}
                {var tooltip = lastName + ", " + firstName + " (" + eid + ")"}
            {else}
                {var tooltip = firstName + " " + lastName + " (" + eid + ")"}
            {/if}
            {var tooltip = tooltip.replace(/"/g, '&quot;')}
            <div class="relative gb-student-cell" title="${tooltip}">
                <div class="gb-value">
                    <div class="rowHeader">
                        <div style="display: flex; align-items: center;">
                            <div style="margin-right: 7px;">
                                <sakai-user-photo user-id="${userId}" profile-popup="on"></sakai-user-photo>
                            </div>
                            <div>
                                <a href="javascript:void(0);" class="gb-view-grade-summary" tabindex="-1">
                                    <input type="hidden" value="${userId}" class="userIds">
                                    {if settings.isStudentOrderedByLastName}
                                        <div>
                                            <span class="gb-last-name">${lastName}</span>,
                                            <span class="gb-first-name">${firstName}</span>
                                        </div>
                                        <div>
                                            (<span class="gb-eid">${eid}</span>)
                                        </div>
                                    {else}
                                        <div>
                                            <span class="gb-first-name">${firstName}</span>
                                            <span class="gb-last-name">${lastName}</span>
                                        </div>
                                        <div>
                                            (<span class="gb-eid">${eid}</span>)
                                        </div>
                                    {/if}
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </script>
        <script id="metadataTemplate" type="text/template">
            <div id="${id}" class="gb-metadata">
                <a href="javascript:void(0);" class="gb-metadata-close"></a>
                <div class="gb-metadata-summary">
                    <h4 class="sr-only"><wicket:message key="metadata.header" /></h4>
                    <dl class="sr-only dl-horizontal">
                        <dt><wicket:message key="metadata.student" /></dt>
                        <dd>${student.lastName}, ${student.firstName} (${student.eid})</dd>
                        {if defined('assignment')}
                        <dt><wicket:message key="metadata.assignment" /></dt>
                        <dd>${assignment.title}</dd>
                        {/if}
                        {if defined('value')}
                        <dt><wicket:message key="metadata.score" /></dt>
                        <dd>${value}</dd>
                        {/if}
                        {if defined('courseGrade')}
                        <dt><wicket:message key="metadata.courseGrade" /></dt>
                        <dd>${courseGrade}</dd>
                        {/if}
                        {if defined('category')}
                        <dt><wicket:message key="metadata.category" /></dt>
                        <dd>${category.categoryName}</dd>
                        {/if}
                        {if defined('categoryAverage')}
                        <dt><wicket:message key="metadata.categoryAverage" /></dt>
                        <dd>${categoryAverage}</dd>
                        {/if}
                    </dl>
                </div>
                <div class="gb-metadata-notifications">
                    {if defined('notifications') && notifications.length > 0}
                        <p class="sr-only"><wicket:message key="metadata.flags" /></p>
                        <ul>
                            {for notification in notifications}
                                {if notification.type == 'comment'}
                                    <li class="gb-metadata-comment-notification">
                                        <span class="gb-flag-comment"></span> <wicket:message key="grade.notifications.hascomment"/>
                                        <blockquote><wicket:message key="grade.notifications.commentloading"/></blockquote>
                                        {if defined('readonly') && !readonly}
                                            {if defined('hasCourseGradeComment') && hasCourseGradeComment == 1}
                                                <div>
                                                    <a href="javascript:void(0);" class="gb-edit-course-grade-comments"><wicket:message key="grade.notifications.editcomment"/></a>
                                                </div>
                                            {else}
                                                <div>
                                                    <a href="javascript:void(0);" class="gb-edit-comments"><wicket:message key="grade.notifications.editcomment"/></a>
                                                </div>
                                            {/if}
                                        {/if}
                                    </li>
                                {elseif notification.type == 'extra-credit'}
                                    <li>
                                        <span class="gb-flag-extra-credit"></span> <wicket:message key="grade.notifications.overlimit"/>
                                    </li>
                                {elseif notification.type == 'excused'}
                                    <li>
                                        <span class="gb-flag-excused"></span> <wicket:message key="grade.notifications.excused"/>
                                    </li>
                                {elseif notification.type == 'save-error'}
                                    <li>
                                        <span class="gb-flag-save-error"></span> <wicket:message key="grade.notifications.haserror"/>
                                    </li>
                                    <li>
                                        <span class="gb-flag-save-invalid"></span> <wicket:message key="grade.notifications.invalid"/>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0);" class="gb-revert-score"><wicket:message key="grade.notifications.revert"/></a>
                                    </li>
                                {elseif notification.type == 'save-invalid'}
                                    <li>
                                        <span class="gb-flag-save-invalid"></span> <wicket:message key="grade.notifications.invalid"/>
                                    </li>
                                {elseif notification.type == 'concurrent-edit'}
                                    {if notification.showSaveError}
                                        <li>
                                            <span class="gb-flag-save-error"></span> <wicket:message key="grade.notifications.haserror"/>
                                        </li>
                                    {/if}
                                    <li>
                                        <span class="gb-flag-concurrent-edit"></span> <wicket:message key="grade.notifications.concurrentedit"/>
                                        {if notification.conflict}
                                            <dl class="dl-horizontal">
                                                <dt><wicket:message key="grade.notifications.concurrentedituser"/></dt>
                                                <dd>${notification.conflict.lastUpdatedBy}</dd>
                                                <dt><wicket:message key="grade.notifications.concurrentedittime"/></dt>
                                                <dd>${new Date(notification.conflict.lastUpdated).toLocaleTimeString()}</dd>
                                            </dl>
                                        {/if}
                                    </li>
                                {elseif notification.type == 'external-invalid'}
                                    <li>
                                        <span class="gb-flag-save-invalid"></span> <wicket:message key="grade.notifications.externalinvalid"/>
                                    </li>
                                {elseif notification.type == 'external'}
                                    <li id="" class="gb-external-app-wrapper">
                                        <span class="gb-flag-external"></span> <wicket:message key="grade.notifications.isexternal"/>
                                    </li>
                                {elseif notification.type == 'readonly'}
                                    <li>
                                        <span class="gb-flag-read-only"></span> <wicket:message key="grade.notifications.readonly"/>
                                    </li>
                                    <li>
                                        <span class="gb-flag-read-only"></span> <wicket:message key="grade.notifications.privileges"/>
                                    </li>
                                {else}
                                    <li>
                                        <span class="gb-flag-${notification.type}"></span> ${notification.type}
                                    </li>
                                {/if}
                            {/for}
                        </ul>
                    {else}
                        <p><wicket:message key="metadata.noflags"/></p>
                    {/if}
                </div>
            </div>
        </script>
        <script id="tooltipTemplate" type="text/template">
            <div id="gbTooltip" class="gb-metadata">
                <a href="javascript:void(0);" class="gb-metadata-close"></a>
                <p>
                    {if defined('icon')}
                        <span class="${icon}"></span>
                    {/if}
                    ${tooltip}
                </p>
            </div>
        </script>
        <script id="studentSummaryTemplate" type="text/template">
            <wicket:message key="label.toolbar.studentsummary"/>
        </script>
        <script id="gradeItemSummaryTemplate" type="text/template">
            <wicket:message key="label.toolbar.gradeitemsummary"/>
        </script>
        <script id="gradeItemSummaryTooltipTemplate" type="text/template">
            <wicket:message key="label.toolbar.gradeitemsummary-tooltip"/>
        </script>
        <script id="gradeMenuTooltip" type="text/template">
            <wicket:message key="grade.menulabel"/>
        </script>
        <script id="gradeHeaderMenuTooltip" type="text/template">
            <wicket:message key="assignment.menulabel"/>
        </script>
        <script id="newGradeItemPopoverTitle" type="text/template">
            <wicket:message key="label.addgradeitem.highlight.title"/>
        </script>
        <script id="newGradeItemPopoverMessage" type="text/template">
            <wicket:message key="label.addgradeitem.highlight.message"/>
        </script>
        <script id="chartStudentsGradeMessage" type="text/template">
            <wicket:message key="chart.students.grade.message"/>
        </script>
        <script id="chartYourGradeMessage" type="text/template">
            <wicket:message key="chart.yourgrade.message"/>
        </script>
        <script id="captionTemplate" type="text/template">
            <div id="gradeTableCaption">
                <div class="container-fluid">
                    <div class="sr-only row">
                        <h4><wicket:message key="gradetable.caption.summaryheader"/></h4>
                        <p><wicket:message key="gradetable.caption.summary"/></p>
                    </div>
                    <div class="row mb-3">
                        <div class="col-12">
                            <h4 class="mb-2"><wicket:message key="gradetable.caption.keyboardnavigationheader"/></h4>
                            <wicket:message key="gradetable.caption.keyboardnavigation"/>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <div class="col-12">
                            <h4 class="mb-2"><wicket:message key="gradetable.caption.keyboardshortcutsheader"/></h4>
                            <wicket:message key="gradetable.caption.keyboardshortcuts"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <wicket:message key="gradetable.caption.keyboardtablemodeshortcuts"/>
                        </div>
                        <div class="col-md-6">
                            <wicket:message key="gradetable.caption.keyboardeditingshortcuts"/>
                        </div>
                    </div>
                </div>
            </div>
        </script>
    </wicket:panel>
</html>
